<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>MyTechBook</title>
        
    <link rel="stylesheet" type="text/css" href="../../static/css/main.css">
</head>
<body>
<div class="navbar navbar-line">
    <div class="container">
        <div class="logo">
            
                MyTechBook
            
        </div>
        <input type="checkbox" id="idoc_nav" />
        <div class="menu_tree">
        <ul><li><a href="../../index.html">首页</a></li><li><a href="#"><span></span>前沿观察</a><ul><li><a href="../../html/前沿观察/ECMAScript 6入门.html">ECMAScript 6入门</a></li><li><a href="../../html/前沿观察/Immutable详解及React中实践.html">Immutable详解及React中实践</a></li><li><a href="../../html/前沿观察/Node.js MVC框架ThinkJS.html">Node.js MVC框架ThinkJS</a></li><li><a href="../../html/前沿观察/Nodejs 5.0.0版本.html">Nodejs 5.0.0版本</a></li><li><a href="../../html/前沿观察/关系型数据库PostgreSQL.html">关系型数据库PostgreSQL</a></li><li><a href="../../html/前沿观察/轻型MVVM框架Vue.js.html">轻型MVVM框架Vue.js</a></li><li><a href="../../html/前沿观察/基于nodejs的开发框架koa.html">基于nodejs的开发框架koa</a></li></ul></li><li><a href="#"><span></span>前端工程化</a><ul><li><a href="../../html/前端工程化/前端模板.html">前端模板</a></li><li><a href="../../html/前端工程化/性能优化和前端工程的爱恨情仇.html">性能优化和前端工程的爱恨情仇</a></li><li><a href="../../html/前端工程化/webpack入门及实践.html">webpack入门及实践</a></li><li><a href="../../html/前端工程化/前端工程化不完全装逼指南.html">前端工程化不完全装逼指南</a></li></ul></li><li><a href="#"><span></span>性能优化</a><ul><li><a href="../../html/性能优化/jshint代码质量检测.html">jshint代码质量检测</a></li><li><a href="../../html/性能优化/jshint配置说明.html">jshint配置说明</a></li><li><a href="../../html/性能优化/NC性能优化.html">NC性能优化</a></li><li><a href="../../html/性能优化/React编码规范.html">React编码规范</a></li><li><a href="../../html/性能优化/性能优化待办事项.html">性能优化待办事项</a></li><li><a href="../../html/性能优化/性能优化点总结.html">性能优化点总结</a></li></ul></li><li><a href="#"><span></span>技术分享</a><ul><li><a href="../../html/技术分享/React技术分享.html">React技术分享</a></li><li><a href="../../html/技术分享/学习Git.html">学习Git</a></li><li><a href="../../html/技术分享/面向对象.html">面向对象</a></li><li><a href="../../html/技术分享/Node.js知识详解.html">Node.js知识详解</a></li><li class="active"><a href="../../html/技术分享/2015年大前端技术年终总结.html">2015年大前端技术年终总结</a></li></ul></li><li><a href="#"><span></span>随想笔记</a><ul><li><a href="../../html/随想笔记/项目技术栈规划.html">项目技术栈规划</a></li><li><a href="../../html/随想笔记/笔试面试大纲.html">笔试面试大纲</a></li></ul></li><li><a href="../../html/CONTACT.html">CONTACT</a></li></ul>    
        </div>
        
        
        <div class="forkgithub"><a target="_blank" href="https://github.com/sujunming">fork on github</a></div>
        

        <section class="idoc_nav_btn">
            <label for="idoc_nav"><span></span></label>
        </section>
    </div>
    
</div>




<div class="container">

    <div class="page-toc">
        <ul><li><a href="#t02015年大前端技术年终总结">2015年大前端技术年终总结</a><ul><li><a href="#t11. 前端">1. 前端</a><ul><li><a href="#t21.1 工具">1.1 工具</a><ul><li><a href="#t31.1.1 构建工具">1.1.1 构建工具</a></li><li><a href="#t41.1.2 编译工具">1.1.2 编译工具</a></li><li><a href="#t51.1.3 包管理工具">1.1.3 包管理工具</a></li></ul></li><li><a href="#t61.2 前端类库和框架">1.2 前端类库和框架</a><ul><li><a href="#t71.2.1 类库">1.2.1 类库</a></li><li><a href="#t81.2.2 mvc框架">1.2.2 mvc框架</a></li><li><a href="#t91.2.3 mvvm框架">1.2.3 mvvm框架</a></li><li><a href="#t101.2.4 UI框架">1.2.4 UI框架</a></li></ul></li><li><a href="#t111.3 设计风格">1.3 设计风格</a></li><li><a href="#t121.4 Js语言相关">1.4 Js语言相关</a></li><li><a href="#t131.5 css预处理器">1.5 css预处理器</a></li><li><a href="#t141.6 模块化规范">1.6 模块化规范</a></li><li><a href="#t151.7 测试">1.7 测试</a></li><li><a href="#t161.8 响应式方案">1.8 响应式方案</a></li><li><a href="#t171.9 编辑器和IDE">1.9 编辑器和IDE</a></li><li><a href="#t181.10 移动开发">1.10 移动开发</a></li></ul></li><li><a href="#t192. Node相关">2. Node相关</a><ul><li><a href="#t202.1 框架">2.1 框架</a></li><li><a href="#t212.2 优秀第三方包">2.2 优秀第三方包</a></li><li><a href="#t222.3 数据库">2.3 数据库</a></li></ul></li></ul></li></ul>
    </div>
    
    <div class="content markdown-body">
        <h1 id="t02015&#x5E74;&#x5927;&#x524D;&#x7AEF;&#x6280;&#x672F;&#x5E74;&#x7EC8;&#x603B;&#x7ED3;">2015&#x5E74;&#x5927;&#x524D;&#x7AEF;&#x6280;&#x672F;&#x5E74;&#x7EC8;&#x603B;&#x7ED3; <a href="#t02015&#x5E74;&#x5927;&#x524D;&#x7AEF;&#x6280;&#x672F;&#x5E74;&#x7EC8;&#x603B;&#x7ED3;"> # </a></h1>
<blockquote>
<p>&#x6570;&#x8BF4;&#x524D;&#x7AEF;&#x6280;&#x672F;&#xFF0C;&#x5206;&#x7C7B;&#x56DE;&#x987E;&#x70B9;&#x8BC4;&#x3002;</p>
</blockquote>
<h2 id="t11. &#x524D;&#x7AEF;">1. &#x524D;&#x7AEF; <a href="#t11. &#x524D;&#x7AEF;"> # </a></h2>
<h3 id="t21.1 &#x5DE5;&#x5177;">1.1 &#x5DE5;&#x5177; <a href="#t21.1 &#x5DE5;&#x5177;"> # </a></h3>
<h4 id="t31.1.1 &#x6784;&#x5EFA;&#x5DE5;&#x5177;">1.1.1 &#x6784;&#x5EFA;&#x5DE5;&#x5177; <a href="#t31.1.1 &#x6784;&#x5EFA;&#x5DE5;&#x5177;"> # </a></h4>
<ul>
<li>grunt </li>
<li>gulp </li>
<li>webpack </li>
<li>fis3 </li>
<li>coolie </li>
<li>jdf</li>
</ul>
<blockquote>
<p>&#x7CBE;&#x5F69;&#x70B9;&#x8BC4;&#xFF1A;</p>
</blockquote>
<h4 id="t41.1.2 &#x7F16;&#x8BD1;&#x5DE5;&#x5177;">1.1.2 &#x7F16;&#x8BD1;&#x5DE5;&#x5177; <a href="#t41.1.2 &#x7F16;&#x8BD1;&#x5DE5;&#x5177;"> # </a></h4>
<ul>
<li>babel </li>
<li>browserify</li>
</ul>
<blockquote>
<p>&#x7CBE;&#x5F69;&#x70B9;&#x8BC4;&#xFF1A;</p>
</blockquote>
<h4 id="t51.1.3 &#x5305;&#x7BA1;&#x7406;&#x5DE5;&#x5177;">1.1.3 &#x5305;&#x7BA1;&#x7406;&#x5DE5;&#x5177; <a href="#t51.1.3 &#x5305;&#x7BA1;&#x7406;&#x5DE5;&#x5177;"> # </a></h4>
<ul>
<li>npm </li>
<li>bower </li>
<li>component</li>
</ul>
<blockquote>
<p>&#x7CBE;&#x5F69;&#x70B9;&#x8BC4;&#xFF1A;</p>
</blockquote>
<h3 id="t61.2 &#x524D;&#x7AEF;&#x7C7B;&#x5E93;&#x548C;&#x6846;&#x67B6;">1.2 &#x524D;&#x7AEF;&#x7C7B;&#x5E93;&#x548C;&#x6846;&#x67B6; <a href="#t61.2 &#x524D;&#x7AEF;&#x7C7B;&#x5E93;&#x548C;&#x6846;&#x67B6;"> # </a></h3>
<h4 id="t71.2.1 &#x7C7B;&#x5E93;">1.2.1 &#x7C7B;&#x5E93; <a href="#t71.2.1 &#x7C7B;&#x5E93;"> # </a></h4>
<ul>
<li>jquery </li>
<li>zepto </li>
<li>underscore </li>
<li>react </li>
<li>redux/reflux/flux</li>
</ul>
<blockquote>
<p>&#x7CBE;&#x5F69;&#x70B9;&#x8BC4;&#xFF1A;</p>
</blockquote>
<h4 id="t81.2.2 mvc&#x6846;&#x67B6;">1.2.2 mvc&#x6846;&#x67B6; <a href="#t81.2.2 mvc&#x6846;&#x67B6;"> # </a></h4>
<ul>
<li>angular1.3 </li>
<li>angular2.0 </li>
<li>ember2.0</li>
<li>backbone</li>
</ul>
<blockquote>
<p>&#x7CBE;&#x5F69;&#x70B9;&#x8BC4;&#xFF1A;</p>
</blockquote>
<h4 id="t91.2.3 mvvm&#x6846;&#x67B6;">1.2.3 mvvm&#x6846;&#x67B6; <a href="#t91.2.3 mvvm&#x6846;&#x67B6;"> # </a></h4>
<ul>
<li>vuejs</li>
<li>avalon </li>
<li>knockout</li>
</ul>
<blockquote>
<p>&#x7CBE;&#x5F69;&#x70B9;&#x8BC4;&#xFF1A;</p>
</blockquote>
<h4 id="t101.2.4 UI&#x6846;&#x67B6;">1.2.4 UI&#x6846;&#x67B6; <a href="#t101.2.4 UI&#x6846;&#x67B6;"> # </a></h4>
<ul>
<li>bootstrap </li>
<li>senmaticui </li>
<li>amazeui </li>
<li>ionic </li>
<li>framework7 </li>
<li>materialui</li>
</ul>
<blockquote>
<p>&#x7CBE;&#x5F69;&#x70B9;&#x8BC4;&#xFF1A;</p>
</blockquote>
<h3 id="t111.3 &#x8BBE;&#x8BA1;&#x98CE;&#x683C;">1.3 &#x8BBE;&#x8BA1;&#x98CE;&#x683C; <a href="#t111.3 &#x8BBE;&#x8BA1;&#x98CE;&#x683C;"> # </a></h3>
<ul>
<li>&#x6241;&#x5E73;&#x5316; </li>
<li>3D</li>
<li>material design</li>
</ul>
<blockquote>
<p>&#x7CBE;&#x5F69;&#x70B9;&#x8BC4;&#xFF1A;</p>
</blockquote>
<h3 id="t121.4 Js&#x8BED;&#x8A00;&#x76F8;&#x5173;">1.4 Js&#x8BED;&#x8A00;&#x76F8;&#x5173; <a href="#t121.4 Js&#x8BED;&#x8A00;&#x76F8;&#x5173;"> # </a></h3>
<ul>
<li>es6 </li>
<li>es7 </li>
<li>typescript </li>
<li>coffeescript</li>
</ul>
<blockquote>
<p>&#x7CBE;&#x5F69;&#x70B9;&#x8BC4;&#xFF1A;</p>
</blockquote>
<h3 id="t131.5 css&#x9884;&#x5904;&#x7406;&#x5668;">1.5 css&#x9884;&#x5904;&#x7406;&#x5668; <a href="#t131.5 css&#x9884;&#x5904;&#x7406;&#x5668;"> # </a></h3>
<ul>
<li>less </li>
<li>sass </li>
<li>stylus</li>
<li>postcss</li>
</ul>
<blockquote>
<p>&#x7CBE;&#x5F69;&#x70B9;&#x8BC4;&#xFF1A;</p>
</blockquote>
<h3 id="t141.6 &#x6A21;&#x5757;&#x5316;&#x89C4;&#x8303;">1.6 &#x6A21;&#x5757;&#x5316;&#x89C4;&#x8303; <a href="#t141.6 &#x6A21;&#x5757;&#x5316;&#x89C4;&#x8303;"> # </a></h3>
<ul>
<li>amd </li>
<li>cmd </li>
<li>commonjs </li>
<li>umd </li>
<li>es6 Module</li>
</ul>
<blockquote>
<p>&#x7CBE;&#x5F69;&#x70B9;&#x8BC4;&#xFF1A;</p>
</blockquote>
<h3 id="t151.7 &#x6D4B;&#x8BD5;">1.7 &#x6D4B;&#x8BD5; <a href="#t151.7 &#x6D4B;&#x8BD5;"> # </a></h3>
<ul>
<li>mocha </li>
<li>chai</li>
</ul>
<blockquote>
<p>&#x7CBE;&#x5F69;&#x70B9;&#x8BC4;&#xFF1A;</p>
</blockquote>
<h3 id="t161.8 &#x54CD;&#x5E94;&#x5F0F;&#x65B9;&#x6848;">1.8 &#x54CD;&#x5E94;&#x5F0F;&#x65B9;&#x6848; <a href="#t161.8 &#x54CD;&#x5E94;&#x5F0F;&#x65B9;&#x6848;"> # </a></h3>
<ul>
<li>&#x767E;&#x5206;&#x6BD4; </li>
<li>media query</li>
<li>em&#x548C;rem </li>
<li>lib-flexible </li>
<li>hotcss</li>
</ul>
<blockquote>
<p>&#x7CBE;&#x5F69;&#x70B9;&#x8BC4;&#xFF1A;</p>
</blockquote>
<h3 id="t171.9 &#x7F16;&#x8F91;&#x5668;&#x548C;IDE">1.9 &#x7F16;&#x8F91;&#x5668;&#x548C;IDE <a href="#t171.9 &#x7F16;&#x8F91;&#x5668;&#x548C;IDE"> # </a></h3>
<ul>
<li>sublime </li>
<li>atom</li>
<li>webstorm</li>
</ul>
<blockquote>
<p>&#x7CBE;&#x5F69;&#x70B9;&#x8BC4;&#xFF1A;</p>
</blockquote>
<h3 id="t181.10 &#x79FB;&#x52A8;&#x5F00;&#x53D1;">1.10 &#x79FB;&#x52A8;&#x5F00;&#x53D1; <a href="#t181.10 &#x79FB;&#x52A8;&#x5F00;&#x53D1;"> # </a></h3>
<ul>
<li>html5 + css3</li>
<li>react-native</li>
<li>phonegap </li>
<li>meteor</li>
<li>Cordova</li>
<li>&#x5FAE;&#x4FE1;&#x5F00;&#x53D1;</li>
</ul>
<blockquote>
<p>&#x7CBE;&#x5F69;&#x70B9;&#x8BC4;&#xFF1A;</p>
</blockquote>
<h2 id="t192. Node&#x76F8;&#x5173;">2. Node&#x76F8;&#x5173; <a href="#t192. Node&#x76F8;&#x5173;"> # </a></h2>
<h3 id="t202.1 &#x6846;&#x67B6;">2.1 &#x6846;&#x67B6; <a href="#t202.1 &#x6846;&#x67B6;"> # </a></h3>
<ul>
<li>express </li>
<li>koa </li>
<li>thinkjs</li>
</ul>
<blockquote>
<p>&#x7CBE;&#x5F69;&#x70B9;&#x8BC4;&#xFF1A;</p>
</blockquote>
<h3 id="t212.2 &#x4F18;&#x79C0;&#x7B2C;&#x4E09;&#x65B9;&#x5305;">2.2 &#x4F18;&#x79C0;&#x7B2C;&#x4E09;&#x65B9;&#x5305; <a href="#t212.2 &#x4F18;&#x79C0;&#x7B2C;&#x4E09;&#x65B9;&#x5305;"> # </a></h3>
<h3 id="t222.3 &#x6570;&#x636E;&#x5E93;">2.3 &#x6570;&#x636E;&#x5E93; <a href="#t222.3 &#x6570;&#x636E;&#x5E93;"> # </a></h3>
<ul>
<li>mongodb </li>
<li>mysql </li>
<li>redis </li>
<li>postgresql </li>
<li>redis </li>
<li>oracle</li>
</ul>
<blockquote>
<p>&#x7CBE;&#x5F69;&#x70B9;&#x8BC4;&#xFF1A;</p>
</blockquote>

        <div class="copyright">Powered by <a href="https://github.com/jaywcjlove/idoc" target="_blank">idoc</a>. Dependence <a href="https://nodejs.org">Node.js</a> run.</div>
    </div>

</div>


</body>
</html>
